<template>
    <div style="width: 100%;height: 100%;">
      <NavBar :title="'操作指南'"    :text="''"  :cityName="''" ></NavBar>
      <pdf v-for="i in numPages" ref="pdfs" :src="pdfSrc" :key="i" :page="i">
      </pdf>
    </div>
  </template>
  <script>

  import pdf from 'vue-pdf' // 引入vue-pdf插件
  export default {
    name: 'protocol',
    components: { pdf ,}, // 注册PDF组件
    data() {
      return {
        pdfSrc: '../../static/qxfwzx.pdf', // PDF文件路径
        numPages: [],
      }
    },
    mounted() {
      this.getProtocol()
    },
    methods: {
      onClickLeft() {
        this.$router.push('Home')
      },
      getProtocol() {
        this.pdfSrc = pdf.createLoadingTask(this.pdfSrc)
  
        this.pdfSrc.promise.then((pdf) => {
          console.log(pdf)
          this.numPages = pdf.numPages
        })
      },
    },
  }
  </script>
  <style scoped>
  ::v-deep .van-nav-bar__content {
    background: #357cff;
  }
  </style>
  